import { FieldType } from "@/constant/codeGenerate";
import { CreateCodeGenerateFieldType } from "@/typings/api";
import type { EditableFormInstance, ProColumns } from "@ant-design/pro-components";
import { EditableProTable } from "@ant-design/pro-components";
import { forwardRef, ForwardRefRenderFunction, useContext, useImperativeHandle, useRef } from "react";
import { CodeGenerateConfigContext } from "../CodeGenerateConfig";
import { Button } from "antd";
import { getUUID } from "@/utils";
import DictionarySelect from "./DictionarySelect";

export interface FieldConfigRef {
    getRowsData: () => CreateCodeGenerateFieldType[];
    validate: () => Promise<Record<number, CreateCodeGenerateFieldType>>;
}

const FieldsConfig: ForwardRefRenderFunction<FieldConfigRef, {}> = (_props, ref) => {
    const { fields, setFields } = useContext(CodeGenerateConfigContext);
    const columns: ProColumns<CreateCodeGenerateFieldType>[] = [
        {
            dataIndex: "name",
            title: "字段名",
            width: 200,
            formItemProps: {
                rules: [{ required: true, message: "字段名为必填项" }],
            },
        },
        {
            dataIndex: "label",
            width: 200,
            title: "中文名",
        },
        {
            dataIndex: "type",
            width: 200,
            title: "字段类型",
            valueType: "select",
            valueEnum: Object.entries(FieldType).reduce((pre, [key, value]) => ({ ...pre, [key]: { text: value } }), {}),
            formItemProps: {
                rules: [{ required: true, message: "字段类型为必填项" }],
            },
        },
        {
            dataIndex: "isTable",
            title: "显示到表格列",
            valueType: "radio",
            valueEnum: { true: { text: "是" }, false: { text: "否" } },
        },
        {
            dataIndex: "isForm",
            title: "显示到表单",
            valueType: "radio",
            valueEnum: { true: { text: "是" }, false: { text: "否" } },
        },
        {
            dataIndex: "unique",
            title: "是否唯一",
            valueType: "radio",
            valueEnum: { true: { text: "是" }, false: { text: "否" } },
        },
        {
            dataIndex: "required",
            title: "是否必填",
            valueType: "radio",
            valueEnum: { true: { text: "是" }, false: { text: "否" } },
        },
        {
            dataIndex: "componentType",
            title: "组件类型",
            valueType: "select",
            valueEnum: { input: { text: '输入框' }, textarea: { text: "文本框" }, inputNumber: { text: "数字输入框" }, radio: { text: "单选框" }, select: { text: "下拉框" } },
        },
        {
            dataIndex: "dictType",
            title: "字典",
            renderFormItem: () => <DictionarySelect />,
        },
        {
            dataIndex: "queryType",
            title: "查询方式",
            valueType: "select",
            valueEnum: {
                fuzzy: { text: "模糊查询", status: "fuzzy" },
                precise: { text: "精确查询", status: "precise" },
            },
        },
        {
            dataIndex: "sortType",
            title: "排序类型",
            valueType: "select",
            valueEnum: {
                desc: { text: "降序" },
                asc: { text: "升序" },
            },
        },
        {
            title: "操作",
            valueType: "option",
            width: 100,
        },
    ];
    const tableRef = useRef<EditableFormInstance<CreateCodeGenerateFieldType>>();
    useImperativeHandle(ref, () => ({
        getRowsData: () => tableRef.current?.getRowsData?.() || [],
        validate: () => tableRef.current!.validateFields() as unknown as Promise<Record<string, CreateCodeGenerateFieldType>>,
    }));
    return (
        <>
            <EditableProTable<CreateCodeGenerateFieldType>
                editableFormRef={tableRef}
                rowKey="_id"
                columns={columns}
                dataSource={fields}
                value={fields}
                onChange={setFields}
                editable={{
                    type: "multiple",
                    editableKeys: fields.map(item => item._id),
                    actionRender: (row, config, defaultDom) => [
                        <Button danger type="link">
                            {defaultDom.delete}
                        </Button>,
                    ],
                }}
                recordCreatorProps={{
                    newRecordType: "dataSource",
                    record: index => ({
                        _id: getUUID(),
                        name: "",
                        type: "String" as CreateCodeGenerateFieldType["type"],
                        isTable: "true",
                        isForm: "true",
                        required: "false",
                        unique: "false",
                    }),
                }}
            />
        </>
    );
};

export default forwardRef(FieldsConfig);
